<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>
	<body>
		<!-- 我是注释 -->
		我是文本
		<div class="box">我是box</div>

		<script>
			var bodyChilNodes = document.body.childNodes
			var commentNode = bodyChilNodes[1]
			var textNode = bodyChilNodes[2]
			var divNode = bodyChilNodes[3]
			// console.log(commentNode, textNode, divNode, bodyChilNodes)

			for (var node of bodyChilNodes) {
				/* if (node.nodeType === 8) {
				} else if (node.nodeType === 3) {
				} else if (node.nodeType === 1) {
				} */

				if (node.nodeType === node.COMMENT_NODE) {
				} else if (node.nodeType === 3) {
				} else if (node.nodeType === 1) {
				}
			}
			console.log(commentNode.nodeType, textNode.nodeType, divNode.nodeType)
			console.log(commentNode.nodeName, textNode.nodeName, divNode.nodeName)
			console.log(commentNode.tagName, textNode.tagName, divNode.tagName)
			// data: 针对非元素节点获取数据
			// innerHTML: 针对元素节点获取内部数据
			console.log(commentNode.data, textNode.data, divNode.data)
			console.log(commentNode.innerHTML, textNode.innerHTML, divNode.innerHTML)
			console.log(commentNode.textContent, textNode.textContent, divNode.textContent)
		</script>
	</body>
</html>
